<!--
 * @Author: folusGan 245942153@qq.com
 * @Date: 2024-07-08 11:08:14
 * @LastEditors: folusGan 245942153@qq.com
 * @LastEditTime: 2024-10-15 15:56:43
 * @Description: 
-->
<template>
  <div class="flex-container full">
    <Category :navs="navs" />
    <div class="right-box pad-10">
      <router-view />
    </div>
  </div>
</template>
<script>
import Category from './category.vue'
export default {
  components: { Category },
  data() {
    return {}
  },
  computed: {
    navs() {
      return [
        {
          routerPath: '/products/handler-sets',
          title: this.$t('handlesets'),
        },
        {
          routerPath: '/products/deadbolts',
          title: this.$t('deadbolts'),
        },
        {
          routerPath: '/products/cylinder',
          title: this.$t('cylinder'),
        },
        {
          routerPath: '/products/handle-series',
          title: this.$t('handleSeries'),
        },
        {
          routerPath: '/products/multi-section-lock',
          title: this.$t('multiSectionLock'),
        },
        {
          routerPath: '/products/smart-options',
          title: this.$t('smartOptions'),
        },
        {
          routerPath: '/products/others',
          title: this.$t('others'),
        },
      ]
    },
  },
}
</script>
<style lang="scss" scoped>
.right-box {
  width: calc(100% - 240px);
  overflow: scroll;
}
</style>
